<template>
	<view>
		<view class="more" v-if="isShowVideo" @click="handleColse"></view>
		<view class="video" v-if="isShowVideo">
			<video :src="videoUrl" controls :autoplay='true' style="width: 100%;height: calc((100vw / 16) * 9);"></video>
		</view>
	</view>
</template>

<script>
	export default {
		name:"video_max",
		data() {
			return {
				
			};
		},
		props: {
			
			//是否超时
			isShowVideo: {
				type: Boolean,
				default: false
			},
			videoUrl:{
				type:String,
				default: ''
			}
			
		},
		methods:{
			handleColse(){
				this.$emit('colse', false);
			}
		}
	}
</script>

<style lang="scss">
.more{
	width: 100vw;
	height:100vh;
	background: rgba(0,0,0,.5);
	position: fixed;
	top: 0;
	left: 0;
	z-index: 999;
}
.video{
	width: 100vw;
	height: auto;
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	z-index: 1000;
}
</style>